<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:insert="~{common :: commomcss}"></head>
  <body>
    <div class="page-holder d-flex align-items-center">
      <div class="container">
        <div class="row align-items-center py-5" >
          <div class="col-lg-5 px-lg-4" style="margin-left: 30%; margin-top: 20%;">
            <h1 class="text-base text-primary text-uppercase mb-4">作业管理系统</h1>
            <form id="loginForm" action="/login" class="mt-4" method="post">
              <div class="form-group mb-4">
                <input type="text" name="username" placeholder="UserId" class="form-control border-0 shadow form-control-lg">
              </div>
              <div class="form-group mb-4">
                <input type="password" name="password" placeholder="Password" class="form-control border-0 shadow form-control-lg text-violet">
              </div>
              <div class="form-group mb-4" th:if="${msg}">
                <input type="text" th:attr="value=${msg}" readonly="readonly" class="form-control border-0 shadow form-control-lg">
              </div>
              <div class="form-group mb-4">
                <div class="custom-control custom-checkbox">
                  <input id="customCheck1" type="checkbox" checked class="custom-control-input">
                  <label for="customCheck1" class="custom-control-label">记住我</label>
                </div>
              </div>
              <button type="submit" class="btn btn-primary btn-lg shadow px-5">登录</button>
            </form>
          </div>
        </div>
      </div>
    </div>
    <!-- JavaScript files-->
    <div th:insert="~{common :: commomjs}"></div>
    <!--登录失败提示-->
    <script>
      $(function (){
        $("[data-toggle='popover']").popover();
      });
    </script>

  </body>
</html>